window.onload=function(){

	var div = document.getElementById('container');
	var imgs=div.getElementsByTagName('img');

	//通过offsetWidth可以获得宽度
	var imgWidth = imgs[0].offsetWidth;

	//设置掩藏门体露出的宽度
	var exposeWidth = 160;

	//设置容器总宽度
	var boxWidth = imgWidth+exposeWidth*(imgs.length-1);

	div.style.width=boxWidth + 'px';

	//计算每道门的初始距离
	setImgsPos(imgWidth,exposeWidth,imgs);

	//计算每道门打开时应移动的距离
	var translate = imgWidth-exposeWidth;

	for(var i=0;i<imgs.length;i++){
		imgs[i].pos=i;
		imgs[i].onmouseover=function(){
			setImgsPos(imgWidth,exposeWidth,imgs);
			for(var j=1;j<=this.pos;j++){
				//img[j].style.left返回的值为字符串，这里要转化为数字
					imgs[j].style.left = parseInt(imgs[j].style.left,10)-translate + 'px';

			}
			//console.log(this.pos);
		}
	}
}
//每道门的初始距离
function setImgsPos(imgWidth,exposeWidth,imgs){
	for(var i=1;i<imgs.length;i++){
		imgs[i].style.left = (imgWidth + (i-1)*exposeWidth) + 'px';

	}
}